<template>
	<view class="homebox">
		<view class="uni-padding-wrap uni-common-mt">
			<uni-segmented-control :current="current" :values="items" style-type="text" active-color="#0aba8c"
				@clickItem="onClickItem" />
		</view>
		<view class="content">
			<view v-if="current === 0">
				<view class="">
					<view class="curbenaa" v-for="(item,index) in vuexdatage" :key="index" @click="cezhanid(item)">
						<view class="curbentopaa">
							{{item.name}}
						</view>
						<view class="curbenconflxaa">
							<view class="curbenpaiaa">
								<view class="curbenconaa">
									<view class="nubbb">
										类型：
									</view>
									<view class="">
										{{item.type}}
									</view>
								</view>
								<view class="curbenconaa">
									<view class="nubbb" >
										编号：
									</view>
									<view class="">
										{{item.code}}
									</view>
								</view>
								<view class="curbenconaa">
									<view class="nubbb" >
										转数比：
									</view>
									<view class="">
										{{item.data_c}}
									</view>
								</view>
								<view class="curbenconaa">
									<view class="nubbb" >
										参数a：
									</view>
									<view class="">
										{{item.yiqi_changshu_a}}
									</view>
								</view>
								<view class="curbenconaa">
									<view class="nubbb" >
										参数b：
									</view>
									<view class="">
										{{item.shuili_luoju_b}}
									</view>
								</view>
							</view>
							<!-- 							<view class="" @click="dingyu(index)">
								<view class="dingyue" v-if="dztai == false">
									+订阅
								</view>
								<view class="quxiao" v-if="dztai !== false">
									+订阅
								</view>
							</view> -->
						</view>
					</view>

				</view>
			</view>
			<view v-if="current === 1">
				<view class="refresh">
					<u-checkbox-group v-model="checkboxValue1" placement="column" @change="checkboxChange">
						<view class="curbenbox" v-for="(item, index) in cezhanlist" :key="index">
							<u-checkbox :name="index">
							</u-checkbox>
							<view class="curben">
								<view class="curbentop">
									{{item.name}}
								</view>
								<view class="curbenconflx">
									<view class="curbencon">
										<view class="nubbb" >
											类型：
										</view>
										<view class="">
											{{item.type}}
										</view>
									</view>
									<view class="curbencon">
										<view class="nubbb">
											编号：
										</view>
										<view class="">
											{{item.code}}
										</view>
									</view>
									<view class="curbencon">
										<view class="nubbb" >
											转数比：
										</view>
										<view class="">
											{{item.data_c}}
										</view>
									</view>
									<view class="curbencon">
										<view class="nubbb" >
											参数a：
										</view>
										<view class="">
											{{item.yiqi_changshu_a}}
										</view>
									</view>
									<view class="curbencon">
										<view class="nubbb" >
											参数b：
										</view>
										<view class="">
											{{item.shuili_luoju_b}}
										</view>
									</view>
								</view>
							</view>
						</view>
					</u-checkbox-group>
					<view @click="dwlocal" class="dwlocalcss" hover-class="checkActive" :hover-stay-time='100'>
						下载到本地
					</view>
					<view class="" style="height: 50rpx;">
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dztai: false,
				items: ['本地数据', '网络数据'],
				current: 0,
				cezhanlist: [],
				datage: [],
				checkboxValue1: [],
				vuexdatage: [],
			}
		},
		onShow() {
			this.jiekou()
			this.vuexdatage = this.vuex_datage
		},
		methods: {
			cezhanid (item){
				console.log('item',item);
				uni.$u.vuex('vuex_liusuyi',item)
				uni.navigateTo({
					url: '/pages/aproduct/liusuyishow'
				});
				// uni.navigateTo({
				// 	url: '/pages/cezhanguanli/show?info=' + encodeURIComponent(JSON.stringify(item))
				// });
			},
			checkboxChange(n) {
				console.log('change', n);
				this.datage.length = 0
				for (var i = 0; i < n.length; i++) {
					this.datage.push(this.cezhanlist[n[i]])
					console.log('this.datage',this.datage);
				}
			},
			// 下载本地
			dwlocal(){
				uni.$u.vuex('vuex_datage', this.datage)
				this.vuexdatage = this.vuex_datage
				this.current = 0
				console.log('下载',this.vuex_datage);
			},
			// dingyu(index) {
			// 	this.dztai = !this.dztai
			// 	console.log('this.dztai', index);
			// },
			onClickItem(e) {
				if (this.current != e.currentIndex) {
					this.current = e.currentIndex;
				}
			},
			jiekou() {
				uni.$u.http.post('/shuili/api/index/lsyList', {

				}).then(res => {
					console.log('res', res);
					if (res.msg == 'success') {
						this.cezhanlist = res.data
					} else {
						uni.$u.toast('获取数据失败')
					}
				}).catch(err => {
					console.log('err', err);
				})
			},
		}
	}
</script>
<style scoped lang="scss">
	.dwlocalcss {
		padding: 10rpx 30rpx;
		background-color: #2dbfae;
		border-radius: 50rpx;
		margin: 20rpx auto;
		width: 400rpx;
		line-height: 50rpx;
		color: #ffffff;
		text-align: center;
	}
	.checkActive {
		background-color: #249c8e;
	}
	.homebox {
		position: relative;
	}

	.refresh {
		margin: 10rpx;
		// background-color: #0aba8c;

		.curbenbox {
			display: flex;
			align-items: center;
			justify-content: space-between;
			background-color: #ffffff;
			border-radius: 20rpx;
			margin:10rpx 20rpx;
			padding: 0rpx 20rpx;

			.curben {
				width: 580rpx;
				// margin: 30rpx auto;
				border-radius: 20rpx;
				// background-color: #ff481a;

				.curbenconflx {
					display: flex;
					justify-content: space-between;
					align-items: center;
					flex-wrap: wrap;
					padding: 20rpx;

					.curbencon {
						width: 260rpx;
						display: flex;
						line-height: 50rpx;
						font-size: 30rpx;
						// background-color: #370fba;
						.nubbb {
						width: 150rpx;
						color: #0aba8c;
						// background-color: #0aba8c;
					}
					}
				}
			}

			.curbentop {
				width: 580rpx;
				// height: 60rpx;
				margin: 0 auto;
				line-height: 60rpx;
				font-size: 30rpx;
				border-bottom: #dfdfdf solid 1rpx;
				text-align: center;
				color: #0aba8c;
				// background-color: #ffeb4c;

			}
		}
	}

	.contentaa {
		width: 750rpx;
	}

	.curbenaa {
		width: 690rpx;
		margin: 30rpx auto;
		border-radius: 20rpx;
		box-shadow: 0rpx 0rpx 20rpx #e8e8e8;
		background-color: #ffffff;

		.curbentopaa {
			width: 640rpx;
			height: 60rpx;
			margin: 0 auto;
			line-height: 60rpx;
			font-size: 30rpx;
			border-bottom: #dfdfdf solid 1rpx;
			text-align: center;
			color: #0aba8c;
			// background-color: #ffeb4c;
			// .curbenconflx {
			// 	display: flex;
			// 	justify-content: space-between;
			// 	align-items: center;
			// 	flex-wrap: wrap;
			// 	padding: 20rpx;
			// 	.curbencon {

			// 	}
			// }
		}

		.curbenconflxaa {
			display: flex;
			justify-content: space-between;
			align-items: center;
			flex-wrap: wrap;
			padding: 20rpx;
			background-color: #ffffff;
			margin: 30rpx 0;
			border-radius: 0 0 20rpx 20rpx;

			.curbenpaiaa {
				width: 650rpx;
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;

				.curbenconaa {
					width: 250rpx;
					line-height: 40rpx;
					font-size: 30rpx;
					display: flex;
					align-items: center;
					
					.nubbb {
						width: 150rpx;
						color: #0aba8c;
					}
					
				}
			}
		}

	}
</style>
<style>
	page {
		background-color: #eaeaea;
	}
</style>